﻿<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>在线考试系统</title>
    <!-- bootstrap 3.0.2 -->
    <link th:href="@{/resource/css/bootstrap.min.css}" rel="stylesheet" type="text/css" />
    <!-- Theme style -->
    <link th:href="@{/resource/css/style.css}" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" th:href="@{/resource/js/jQueryMessage/css/message.skin.css}" />
</head>

<body>
	<div class="row">
	    <div class="col-md-12">
	    	<h1 class="panel-heading">添加试题</h1>
	        <!--breadcrumbs start -->
	        <ul class="breadcrumb">
				<li><a href="/admin/dashboard/toIndex"><i class="fa fa-home"></i> 首页</a></li>
				<li class="active">添加试题</li>
			</ul>
	        <!--breadcrumbs end -->
	    </div>
	</div>
	<div class="row">
		<div class="col-lg-12">
			<section class="panel">
				<div class="panel-body">
					<form class="col s12" id="questionFrom" enctype="multipart/form-data" th:action="@{/questionManager/addOneQuestion}"
						  onsubmit="return validateForm();" method="post">
						<div class="form-group form-control-medium">
							<label for="content">题目：</label>
							<textarea id="content" name="content" type="text" class="form-control" v-model="content"></textarea>
							<!--<input id="content" name="content" type="text" class="form-control"/>-->
						</div>
						<div class="form-group form-control-medium">
							<label for="type">类型：</label>
							<select id="type" name="type"  class="form-control" v-model="type">
								<option selected="selected" value="简答题">简答题</option>
								<option value="单选题">单选题</option>
							</select>
							<!--<input id="type" name="type" type="select" class="form-control"/>-->
						</div>

						<div class="form-group form-control-medium">
							<label for="answer">标准答案：</label>
							<textarea id="answer" name="answer" type="text" class="form-control" v-model="answer"></textarea>
							<!--<input id="password" name="password" type="password" class="form-control"/>-->
						</div>
						<!--<div class="form-group form-control-medium">-->
							<!--<label for="option_A">选项A：</label>-->
							<!--<input type="radio" value="option_A" v-model="answer"> 标准答案-->
							<!--<input id="option_A" name="option_A" type="text"  class="form-control"/>-->
							<!--<label for="option_B">选项B：</label>-->
							<!--<input type="radio" value="option_B" v-model="answer"> 标准答案-->
							<!--<input id="option_B" name="option_B" type="text"  class="form-control"/>-->
							<!--<label for="option_C">选项C：</label>-->
							<!--<input type="radio" value="option_C" v-model="answer"> 标准答案-->
							<!--<input id="option_C" name="option_C" type="text" class="form-control"/>-->
							<!--<label for="option_D">选项D：</label>-->
							<!--<input type="radio" value="option_D" v-model="answer"> 标准答案-->
							<!--<input id="option_D" name="option_D" type="text" class="form-control"/>-->
						<!--</div>-->


						<div class="form-btn-group-left">
			            	<button type="submit" class="btn btn-info" >保存</button>
							<!--@click="onSubmit"-->
			            </div>
					</form>
				</div>
			</section>
		</div>
	</div>
	<script th:src="@{/resource/js/jquery.min.js}" type="text/javascript"></script>
    <script type="text/javascript" th:src="@{/resource/js/jQueryMessage/js/jquery.plugin.message.js}"></script>
	<!--引入VUE-->
	<script th:src="@{/resource/js/vue.min.js}" type="text/javascript"></script>
    <script type="text/javascript">
		var vm = new Vue({
			el: "#questionFrom",
			data:{
                    content: "",		//题目
					answer: "",			//标准答案
                    type: "简答题",			//类型
					rightOption:"",		//正确选项
                    option_A:"",
                    option_B:"",
                    option_C:"",
                    option_D:""
			},
			methods:{
                onSubmit: function(){
					alert(data.answer);
					return false;
				}
			}
		});



	   	/* 保存方法 */
	    function validateForm(){
	    	var content = $("#content").val();
	    	var content = $("#type").val();
	    	var answer = $("#answer").val();
	    	if(content == null || content==''){
	    		$("body").MessageBox({
					type: 'error',
					message:'题目不能为空',
					timeout:3000,
					callbak:null
				});
	    		return false;
	    	}
//	    	if(content == null || content == ""){
//	    		$("body").MessageBox({
//					type: 'error',
//					message:'密码不能为空',
//					timeout:3000,
//					callbak:null
//				});
//	    		return false;
//	    	}
	    	return true;
	    }
    </script>
</body>
</html>
